import React, {useState, useEffect} from 'react';
import {StyleSheet, View, Switch, Text} from 'react-native';

const Switch开关切换7_18 = () => {
  const [switchValue, setSwitchValue] = useState(true);

  useEffect(() => {
    console.log(switchValue);
    return () => {};
  }, [switchValue]);

  return (
    <View style={styles.root}>
      <Text style={{color: 'orange', fontSize: 20, textAlign: 'center'}}>
        7_18Switch开关切换
      </Text>

      <Switch
        value={switchValue}
        onValueChange={value => {
          setSwitchValue(value);
        }}
        disabled={false}
        trackColor={{true: 'red', false: '#808080'}}
        thumbColor={switchValue ? '#2030ff' : '#303030'}
      />
    </View>
  );
};

export default Switch开关切换7_18;

const styles = StyleSheet.create({
  root: {
    width: '100%',
    height: 100,
    alignItems: 'center',
  },
});
